<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head th:include="admin/common :: commonhead">
    <!--<div th:replace="admin/common :: commonhead"></div>-->
</head>
<head>
    <title>教师管理</title>
    <!--这里写这个页面单独需要的css-->
</head>
<body class="sticky-header">

<section>
    <!--  引入左侧边  -->
    <div th:replace="admin/common :: left"></div>

    <div class="main-content">
        <div th:replace="admin/common :: header-section"></div>
        <!--这里开始写东西-->
        <div class="wrapper">
            <div class="row">
                <div class="col-sm-12">
                    <section class="panel">
                        <header class="panel-heading">
                            教师账号管理
                            <span class="tools pull-right">
                        <a href="javascript:;" class="fa fa-chevron-down"></a>
                        <a href="javascript:;" class="fa fa-times"></a>
                     </span>
                        </header>
                        <div class="panel-body">
                            <div class="">
                                <a class="btn btn-success" data-toggle="modal" href="#myModal">添加</a>
                                <span th:text="${add_msg}" th:if="${not #strings.isEmpty(add_msg)}"></span>
                            </div>
                            <div class="adv-table editable-table ">
                                <div class="space15"></div>
                                <table class="table table-striped table-hover table-bordered" id="editable-sample">
                                    <thead>
                                    <tr>
                                        <th>教工号</th>
                                        <th>姓名</th>
                                        <th>性别</th>
                                        <th>电话</th>
                                        <th>编辑</th>
                                        <th>删除</th>
                                    </tr>
                                    </thead>
                                    <tbody th:each="teacher : ${teachers.getRecords}">
                                    <tr class="">
                                        <td>[[${teacher.teaId}]]</td>
                                        <td>[[${teacher.teaName}]]</td>
                                        <td>[[${teacher.teaSex}]]</td>
                                        <td class="center">[[${teacher.teaPhone}]]</td>
                                        <td><a th:href="@{/admin/teacher/}+${teacher.teaId}"
                                               class="btn btn-success">编辑</a></td>
                                        <td>
                                            <form method="post" th:action="@{/admin/deleteTeacher/}+${teacher.teaId}">
                                                <input type="hidden" name="_method" value="delete">
                                                <button class="btn btn-danger" type="submit"
                                                        onclick="return confirm('删除该教师账号将同时删除其相关其他信息，确认要删除吗？')">删除
                                                </button>
                                            </form>
                                        </td>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>

                            <div class="row">
                                <div class="col-lg-6">
                                    <div class="dataTables_info" id="editable-sample_info">
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="dataTables_paginate paging_bootstrap pagination">
                                        <ul>
                                            <li class="prev">
                                                <a th:href="@{/admin/teachers(pn=${teachers.current - 1 < 1 ? 1 : teachers.current - 1})}">← 上一页</a>
                                            </li>
                                            <li th:class="${num == teachers.current ? 'active' : ''}" th:each="num : ${#numbers.sequence(1, teachers.pages)}">
                                                <a th:href="@{/admin/teachers(pn=${num})}" th:text="${num}"></a>
                                            </li>
                                            <li class="next">
                                                <a th:href="@{/admin/teachers(pn=${teachers.current + 1 > teachers.pages ? teachers.pages : teachers.current + 1})}">下一页 → </a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </section>
                </div>
            </div>

            <!-- Modal -->
            <div aria-hidden="true" aria-labelledby="myModalLabel" role="dialog" tabindex="-1" id="myModal"
                 class="modal fade">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                            <h4 class="modal-title">详细信息</h4>
                        </div>
                        <form method="post" th:action="@{/admin/addTeacher}">
                            <div class="modal-body">
                                <input type="text" autofocus="" placeholder="教工号" class="form-control" name="teaId">
                                <br>
                                <input type="text" autofocus="" placeholder="姓名" class="form-control"
                                       name="teaName"><br>
                                <input type="text" autofocus="" placeholder="邮箱" class="form-control"
                                       name="teaEmail"><br>
                                <input type="text" autofocus="" placeholder="电话号码" class="form-control" name="teaPhone"><br>
                                <input type="password" placeholder="密码" class="form-control" name="teaPassword"><br>
                                <div class="radios">
                                    <label for="radio-01" class="label_radio col-lg-6 col-sm-6">
                                        <input type="radio" checked="" value="男" id="radio-01" name="teaSex"> 男
                                    </label>
                                    <label for="radio-02" class="label_radio col-lg-6 col-sm-6">
                                        <input type="radio" value="女" id="radio-02" name="teaSex"> 女
                                    </label>
                                </div>
                                <br>

                            </div>
                            <div class="modal-footer">
                                <button data-dismiss="modal" class="btn btn-default" type="button">取消</button>
                                <button class="btn btn-primary" type="submit">提交</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
            <!-- modal -->

        </div>
    </div>
</section>

<div th:replace="admin/common :: commonjs"></div>
<!--data table-->
<script type="text/javascript" th:src="@{/js/data-tables/jquery.dataTables.js}"></script>
<script type="text/javascript" th:src="@{/js/data-tables/DT_bootstrap.js}"></script>
<!--script for editable table-->
<script th:src="@{/js/editable-table.js}"></script>

</body>
</html>